@CHARSET "UTF-8";
/*
Main YUILibrary.com CSS.

Rules are grouped logically by the elements or page sections to which they
apply, starting at roughly the top left of the page and continuing rightwards
and downwards.

Core element styles and generic reusable styles are listed first, in order to
give them lower precedence.

Please try to adhere to this grouping to keep this stylesheet maintainable.
*/

/* -- Core elements --------------------------------------------------------- */
html, body { height: 100%; }

html {
    background: #fff;
    color: #333;
    overflow-y: scroll; /* Always show vertical scrollbar to avoid reflow. */
}

body {
    font: 13px/1.4 Helvetica, 'DejaVu Sans', 'Bitstream Vera Sans', Arial, sans-serif;
    margin: 0;
    padding: 0;
}

a {
    color: #356de4;
    text-decoration: none;
}

a:hover { text-decoration: underline; }
a:visited { color: #6d93e4; }

hr {
    border: none;
    border-top: 1px solid #afafaf;
}

/* -- Paragraphs and paragraph-like blocks ---------------------------------- */
p,
pre.code, pre.terminal, pre.cmd {
    margin: 1.2em 0;
}

dd p, td p { margin-bottom: 0; }
dd p:first-child, td p:first-child { margin-top: 0; }

/* -- Headings -------------------------------------------------------------- */
h1, h2, h3, h4, h5, h6 {
    color: #eb8c28;/*was #f80*/
    /*font-family: 'Trebuchet MS', sans-serif;*/
    font-family: 'Maven Pro', Helvetica, sans-serif;
    font-weight: bold;
    line-height: 1.1;
    margin: 1.1em 0 0.5em;
}

h1 {
    font-size: 184.6%;
    color: #30418C;
    margin: 0.75em 0 0.5em;
}

h2 { font-size: 153.846%; }

h3 { font-size: 138.462%; }

h4 {
    border-bottom: 1px solid #DBDFEA;
    font-size: 115.385%;
    font-weight: normal;
    padding-bottom: 2px;
}

h5, h6 { font-size: 107.692%; }

/* -- Code and examples ----------------------------------------------------- */
code, kbd, pre, samp {
    font-family: Menlo, Monaco, 'DejaVu Sans Mono', 'Bitstream Vera Sans Mono', 'Consolas', 'Courier New', Courier, monospace;
    font-size: 92.308%;
    line-height: 1.35;
}

p code, p kbd, p samp {
    background: #FCFBFA;
    border: 1px solid #EFEEED;
    padding: 0 3px;
}

a code, a kbd, a samp,
pre code, pre kbd, pre samp,
table code, table kbd, table samp,
.intro code, .intro kbd, .intro samp,
.toc code, .toc kbd, .toc samp {
    background: none;
    border: none;
    padding: 0;
}

pre.code, pre.terminal, pre.cmd, #doc pre.prettyprint {
    overflow-x: auto;
    padding: 0.3em 0.6em;
    _width: 99%;
}

pre.code, #doc pre.prettyprint {
    background: #FCFBFA;
    border: 1px solid #EFEEED;
    border-left-width: 5px;
}

pre.terminal, pre.cmd {
    background: #F0EFFC;
    border: 1px solid #D0CBFB;
    border-left: 5px solid #D0CBFB;
}

/* Don't reduce the font size of <code>/<kbd>/<samp> elements inside <pre>
   blocks. */
pre code, pre kbd, pre samp { font-size: 100%; }

/* Used to denote text that shouldn't be selectable, such as line numbers or
   shell prompts. Guess which browser this doesn't work in. */
.noselect {
    -moz-user-select: -moz-none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -o-user-select: none;
    user-select: none;
}

/* -- Lists ----------------------------------------------------------------- */
dd { margin: 0.2em 0 0.7em 1em; }
dl { margin: 1em 0; }
dt { font-weight: bold; }

/* -- Tables ---------------------------------------------------------------- */
caption, th { text-align: left; }

table {
    border-collapse: collapse;
    width: 100%;
}

td, th {
    border: 0px;
    padding: 5px 12px;
    vertical-align: top;
}

td { background: #E6E9F5; }
td dl { margin: 0; }
td dl dl { margin: 1em 0; }
td pre:first-child { margin-top: 0; }

th {
    background: #D2D7E6;/*#97A0BF*/
    border-bottom: none;
    border-top: none;
    color: #000;/*#FFF1D5*/
    font-weight: bold;
    line-height: 1.3;
    white-space: nowrap;
}

/* -- Generic reusable styles ----------------------------------------------- */
a .hover-border {
    border: 1px solid #cfcfcf;
}

a:hover .hover-border {
    border: 1px solid #D4D8EB;
    -moz-box-shadow: 0 0px 6px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0 0px 6px rgba(0, 0, 0, 0.3);
    box-shadow: 0 0px 6px rgba(0, 0, 0, 0.3);
}

/* Pretty buttons. */
.button,
.button:visited {
    color: #444;
}

.button {
    border: 1px solid #e9e9e9;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
    display: inline-block;
    font-family: Helvetica, Arial, sans-serif;
    font-size: 13px;
    font-weight: bold;
    padding: 4px 13px 3px;
    text-align: center;
    -moz-text-shadow: 1px 1px 0 #fff;
    -webkit-text-shadow: 1px 1px 0 #fff;
    text-shadow: 1px 1px 0 #fff;
    white-space: nowrap;

    background: #EFEFEF; /* old browsers */
    background: -moz-linear-gradient(top, #f5f5f5 0%, #efefef 50%, #e5e5e5 51%, #dfdfdf 100%); /* firefox */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f5f5), color-stop(50%,#efefef), color-stop(51%,#e5e5e5), color-stop(100%,#dfdfdf)); /* webkit */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f5f5', endColorstr='#dfdfdf',GradientType=0 ); /* ie */
    *border-color: #dadada;
    *padding-bottom: 5px;
}

.button:hover {
    border-color: #466899;
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
    color: #fff;
    text-decoration: none;
    -moz-text-shadow: 1px 1px 0 #222;
    -webkit-text-shadow: 1px 1px 0 #222;
    text-shadow: 1px 1px 0 #222;

    background: #6396D8; /* old browsers */
    background: -moz-linear-gradient(top, #6396D8 0%, #5A83BC 50%, #547AB7 51%, #466899 100%); /* firefox */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6396D8), color-stop(50%,#5A83BC), color-stop(51%,#547AB7), color-stop(100%,#466899)); /* webkit */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6396D8', endColorstr='#466899',GradientType=0 ); /* ie */
}

/* Big download button, like on the Home page. */
.button.download {
    display: block;
    font-size: 18px;
    margin: 0 0 1em;
    padding: 9px 17px 8px;
}

.clearfix { zoom: 1; }

.clearfix:after {
    clear: both;
    content: '.';
    display: block;
    height: 0;
    line-height: 0;
    visibility: hidden;
}

/* Generic column. Use this inside a grid unit to create gutters. */
.column { margin-right: 10px; }

/* List of components. */
.components {
    list-style-type: square;
    margin: 0;
    padding: 0 0 0 17px;
}

/* Gravatar images. */
.gravatar { border: 1px solid #afafaf; }

.hidden { display: none; }

/*
A hoverable thingamabob that reveals another element containing some content
when hovered over. See js/hoverable.js.
*/
.hoverable { cursor: pointer; }
.hoverable-group { position: relative; }

/* Link to more content */
.more {
    text-align:right;
}

/* Show to screen readers, hide from sighted users. */
.off-left {
    position: absolute;
    left: -9999px;
}

/* Gracefully degrading "▶" icon that uses a Unicode char in good browsers and
   an image in IE. */
.play-icon {
    *background: top left no-repeat url(/img/misc/play.png);
    *display: inline-block;
    *font-size: 0;
    *height: 14px;
    *margin-right: 3px;
    *position: relative;
    *top: 2px;
    *width: 14px;
}

.right {
    float:right;
}

/* A generic box with some padding and a rounded shadowy border. */
.shadow-box {
    background: #f9f9fc;
    border: 1px solid #D4D8EB;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
    padding: 6px 10px;
}


/* List with extra vertical spacing between items. */
.spaced li { margin: 0.8em 0; }

/* -- Component Grid -------------------------------------------------------- */

/* The component grid is used on project category pages to display component
   names and descriptions in a three-column grid. */

.component-grid {
    margin: 1em 0 0 -7px; /* Negative left margin allows for component padding on hover. */
    zoom: 1;
}

.component-grid .components {
    list-style: none;
    padding: 0;
}

.component-grid .desc {
    font-size: 12px;
    line-height: 1.3;
    margin: 2px 0 0;
}

.component-grid .name { font-weight: bold; }

.component-grid .component a {
    border: 1px solid transparent;
    display: block;
    padding: 3px 7px 5px;
    margin-bottom: 3px;
    text-decoration: none;
    _border-color: #f8f8f8;
}

.component-grid .component a .desc { color: #333; }

.component-grid .component a:hover {
    background: #E2EEFB;
    border-color: #BDD6F4;
}

/* The .beta class is used on the docs index page as well. */
.component .beta {
    color: #999;
    font-size: 11px;
    text-decoration: none;
}

/* -- Platform/OS-specific Styles ------------------------------------------- */
.mac-only, .pc-only { visibility: hidden; }

.pc .mac-only,
.mac .pc-only { display: none; }

.mac .mac-only,
.pc .pc-only { visibility: visible; }

/* -- Layout ---------------------------------------------------------------- */
#doc, #wrap {
    background: #fff;
    max-width: 1200px;
    margin: 0 auto;
    min-height: 100%;
    min-width: 960px;
    position: relative;
    *zoom: 1;
}

/* -- User Info ------------------------------------------------------------- */
#userinfo {
    color: #555;
    font-size: 11px;
    list-style: none;
    margin-top: 5px;
    padding: 0;
    text-align: right;
    zoom: 1;
}

#userinfo li {
    border-left: 1px solid #C6C4C4;
    display: inline-block;
    display: inline;
    line-height: 1.2;
    padding: 0 4px 0 7px;
}

#userinfo li:first-child { border: 0; }

#userinfo .gravatar {
    height: 16px;
    margin-right: 3px;
    vertical-align: -5px;
    width: 16px;
}

#userinfo .username { font-weight: bold; }

/* -- Search Box ------------------------------------------------------------ */
#main-search .search-input {
    float: right;
    margin-right: 2px;
}

.search-input { width: 240px; }

/* -- Search AutoComplete Results ------------------------------------------- */
.search,
.search li { margin: 0; }

.search .result,
.search .result .title {
    color: #333;
    font-family: Helvetica, 'DejaVu Sans', 'Bitstream Vera Sans', Arial, sans-serif;
    font-size: 12px;
}

.search .result {
    padding: 3px 0;
    position: relative;
    zoom: 1;
}

.search .result:after {
    clear: both;
    content: '.';
    display: block;
    height: 0;
    line-height: 0;
    visibility: hidden;
}

.search .yui3-aclist-content {
    max-height: 350px;
    overflow-y: auto;
}

.search .yui3-aclist-item-active .result,
.search .yui3-aclist-item-active .result .title {
    color: #fff;
}

.search .result.class .className,
.search .result.module .className { display: none; }

.search .result a {
    color: inherit;
    text-decoration: inherit;
}

.search .result .className,
.search .result .type {
    color: #afafaf;
    font-size: 10px;
}

.search .result .type {
    background: #bfbfbf;
    border-radius: 3px;
    color: #fff;
    font-size: 10px;
    padding: 1px 4px 1px;
}

.search .yui3-aclist-item-active .result .type {
    background: #fff;
    color: #333;
}

.search .result .description {
    font-size: 11px;
}

.search .result .title {
    display: inline;
    margin: 0 50px 0 0;
}

.search .result .type {
    position: absolute;
    right: 0;
    top: 3px;
}

.search .result .yui3-highlight { color: #0000ff; }
.search .yui3-aclist-item-active .yui3-highlight { color: #bfdaff; }

/* -- Navigation ------------------------------------------------------------ */

/* #main-nav prefix is necessary for now to avoid conflicting with phpBB. */

#main-nav {
    line-height: 1.5;
    margin: 12px 0 -2px 0;
    zoom: 1;
}

#main-nav .nav,
#main-nav .nav-submenu,
#subnav ul {
    list-style: none;
    margin: 0;
    padding: 0;
    zoom: 1;
}

#main-nav .nav {
    position: relative;
    z-index: 3;
}

#main-nav .nav a {
    background: -moz-linear-gradient(top, #F4F0EC 0%, #D6D2CE 100%); /* firefox was #eeeeee and #d7d7d7 */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F4F0EC), color-stop(100%,#D6D2CE)); /* webkit */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F4F0EC', endColorstr='#D6D2CE',GradientType=0 ); /* ie */

    border-top: 1px solid #dadada;
    border-right: 1px solid #CDCBC8;
    border-bottom: 1px solid #DEDCD9;
    color: #333;
    display: block;
    padding: 3px 10px 4px 10px;
    text-decoration: none;
    zoom: 1;
    _display: inline-block;
}

#main-nav .nav a:hover {
    background: -moz-linear-gradient(top, #F0EEEB 0%, #EAE8E5 100%); /* firefox was top, #f0f0f0 0%, #eaeaea 100% */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F0EEEB), color-stop(100%,#EAE8E5)); /* webkit */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F0EEEB', endColorstr='#EAE8E5',GradientType=0 ); /* ie */
}

#main-nav .nav-tab {
    float: left;
    position: relative;
}

#main-nav .nav .nav-tab:first-child a,
#main-nav .nav .nav-break a {
    border-left: 1px solid #dadada;
}

#main-nav .nav .nav-tab:first-child .nav-child a,
#main-nav .nav .nav-break .nav-child a,
#main-nav .nav-child:first-child a {
    border-left: none;
}

#main-nav .nav-active a {
    border-bottom-color: #fff;
    border-top: solid 2px #8193C9;
    font-weight: bold;
    padding-bottom: 4px;
}

#main-nav .nav-active a,
#main-nav .nav-active a:hover {
    background: #fff;
    filter: none;
}

#main-nav .nav-active .nav-child a {
    background: none;
    filter: none;
    font-weight: normal;
}

#main-nav .nav-break { margin-left: 15px; }

#main-nav .nav-submenu {
    background: #F5F3F0;
    border: 1px solid #DEDCD9;
    -moz-box-shadow: 1px 3px 8px rgba(0,0,0,0.3);
    -webkit-box-shadow: 1px 3px 8px rgba(0,0,0,0.3);
    box-shadow: 1px 3px 8px rgba(0,0,0,0.3);
    left: -1px;
    min-width: 130px;
    padding: 3px 0;
    position: absolute;
    visibility: hidden;
    z-index: 3;
    _top: 2.2em;
}

#main-nav .nav-tab-focus .nav-submenu,
#main-nav .nav-tab-hover .nav-submenu {
    visibility: visible;
}

#main-nav .nav-break.nav-tab-focus .nav-submenu,
#main-nav .nav-break.nav-tab-hover .nav-submenu,
#main-nav .nav-tab-focus:first-child .nav-submenu,
#main-nav .nav-tab-hover:first-child .nav-submenu {
    left: 0;
}

#main-nav .nav-child {
    display: block;
    float: none;
    white-space: nowrap;
}

#main-nav .nav-child a {
    background: none;
    border: 1px solid transparent;
    border-left: none;
    border-right: none;
    display: block;
    filter: none;
    padding-right: 18px;
    zoom: 1;
    _border: none;
    _display: inline-block;
}

#main-nav .nav-child a:hover {
    background: #fff;
    border-color: #eaeaea;
}

/* -- Subnav & Breadcrumbs -------------------------------------------------- */

#subnav,
#breadcrumbs {
    font-size: 13px;
    margin: 0 20px;
/*    margin: 7px 20px 5px;*/
}

#subnav { margin-left: 0; }

.subnav li {
    display: inline;
    margin-right: 12px;
}

.subnav-active { font-weight: bold; }

.breadcrumbs {
    list-style: none;
    margin: 0;
    padding: 0;
    zoom: 1;
}

.breadcrumbs:after {
    clear: both;
    content: '.';
    display: block;
    height: 0;
    visibility: hidden;
}

.crumb, .separator { float: left; }
.crumb { white-space: nowrap; }

.separator {
    color: #cacaca;
    font-size: 12px;
    padding: 0 6px;
}

/* -- Project Version Label ------------------------------------------------- */
.project-version {
    color: #cfcfcf;
    font-size: 12px;
    position: absolute;
    right: 20px;
    top: 7px;
}

/* -- Body ------------------------------------------------------------------ */
#bd {
    padding: 7px 0 130px; /* Bottom padding prevents the footer from overlapping content on short pages. */
    position: relative;
    width: 99%; /* Prevent intermittent horiz. scrollbar in WebKit (possible grids rounding issue?) */
    *width: 100%;
}

.body-heading,
#bd .content {
    padding: 0 16px 0 20px; /* left align with footer, left edge of tab and breadcrumbs */
    *padding-top: 1px;
}

.body-heading { margin-bottom: 0.3em; }
.body-heading h1 { margin: 0.5em 0 0; }

/* -- Article --------------------------------------------------------------- */

.article ul { margin-top:-.5em; }

/* -- Sidebar --------------------------------------------------------------- */
.sidebar { padding: 0 15px 0 10px; }

.sidebox {
    border: 1px solid #D4D8EB;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    -moz-box-shadow: 0 1px 4px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0 1px 4px rgba(0,0,0,0.1);
    box-shadow: 0 1px 4px rgba(0,0,0,0.1);
    margin: 0 0 15px 0;
    padding-bottom: 1px;
}

.sidebox .hd {
    background: #E5E6F1;
    -moz-border-radius: 3px 3px 0 0;
    -webkit-border-radius: 3px 3px 0 0;
    border-radius: 3px 3px 0 0;
    padding: 4px 7px 5px;
}

.sidebox .bd {
    background: #F9F9FC;
    -moz-border-radius: 0 0 3px 3px;
    -webkit-border-radius: 0 0 3px 3px;
    border-radius: 0 0 3px 3px;
    font-size: 11px;
    padding: 10px 8px 10px;
}

.sidebox .hd h2 {
    color: #30418c;
    font-weight: bold;
    font-size: 107.692%;
    margin: 0;
}

.sidebox li {
    color: #D4D5E3;
    list-style-type: disc;
}

.sidebox ol, .sidebox ul {
    margin: 0;
    padding-left: 14px;
}

.sidebox ol ol, .sidebox ol ul,
.sidebox ul ol, .sidebox ul ul {
    margin: 0;
    padding-left: 14px;
}

/* -- Footer ---------------------------------------------------------------- */
#ft {
    background: #F5F5F5; /* old browsers */
    background: -moz-linear-gradient(top, #F6F5F3 0%, #dcdbd9 100%); /* firefox was... top, #f8f8f8 0%, #ddd 100%*/
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F6F5F3), color-stop(100%,#dcdbd9)); /* webkit */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F6F5F3', endColorstr='#dcdbd9',GradientType=0 ); /* ie */

    border-top: 1px solid #dfddda;
    /*
    width: 100%;
    margin-top: 100px;
    margin-top:30px;
    */
    bottom: 0;
    position: absolute;
    width: 100%;
    *position: static;

}

.copyright {
    font-size: 12px;
    margin: 1em 0;
    padding: 1em 2em 1em 1.5em;
}

/* -- Downloads ------------------------------------------------------------ */

#downloads {
    min-width: 700px;
}

#downloads ul li {
    list-style-type: none;
}
#downloads ul li a {
    background-image: url(/img/archive_zip.png);
    background-repeat: no-repeat;
    background-position: 0 0;
    padding-left: 20px;
}
#downloads ul li strong {
    font-size: 80%;
    font-weight: normal;
    color: #ccc;
    margin-left: 4px;
}
#downloads ul li em {
    font-size: 80%;
    float: right;
    font-style: normal;
    margin-right: 2em;
}

#dl_list .item {
    margin: 1em;
    padding: .5em;
}

#dl_list .item img {
    position: relative;
    top: 6px;
    margin-right: 5px;
}
#dl_list .item a {
    color: #1f2c7b;
    font-weight: bold;
    text-decoration: underline;
    font-size: 120%;
}
#dl_list .item p {
    font-size: 90%;
}

.logo-small {
    height: 22px;
    width: 50px;
}

/* -- YUIConf ribbon -------------------------------------------------------- */
.ribbon {
    position: absolute;
    right: 0;
    top: 0;
    z-index: 5;
}

.ribbon img { border: none; }

#hd.ribbonized .content {
    padding-right: 140px;
}

/* -- Browser hacks --------------------------------------------------------- */
.yui3-u-1-2 { *width: 49%; }
.yui3-u-1-4 { *width: 24%; }
.yui3-u-3-4 { *width: 74%; }

/* -- Print styles ---------------------------------------------------------- */
@media print {
    pre.code,
    pre.terminal,
    pre.cmd,
    #doc pre.prettyprint,
    p code,
    p kbd,
    p samp {
        background: none;
        border: none;
        overflow-x: visible;
        overflow-y: visible;
        padding: 0;
    }

    pre.code,
    pre.terminal,
    pre.cmd,
    #doc pre.prettyprint {
        padding-left: 1em;
    }

    #breadcrumbs,
    #hd,
    #ft .links,
    .no-print,
    .sidebar {
        display: none;
    }

    #ft {
        background: none;
        position: static;
    }

    .print-max-width { width: 100%; }
}